@charset "utf-8";
*{
    margin:0;padding:0
}
#main{
    width:100%;
    background:#f4f4f4;
    height:100%;
    .center{
        width:1200px;
        margin:0 auto;
        ul{
            overflow:hidden;
            position:relative;
            li{
                &:hover{
                    a{
                        color:red;
                    }
                }
                float:left;
                padding:20px 10px;
                list-style:none;
                a{
                   text-decoration:none;
                } 
            }
            .pos{
                position:absolute;
                padding:0;
                height:10px;width:10px;
                border:1px solid red;
                background:white;
                transform:rotate(45deg);
                bottom:-6px;left:195px;
            }
        }
    }
}
#next{
    width:100%;
    height:100%;
    .center{
        width:1200px;
        margin:0 auto;
        overflow:hidden;
        .zhuti{
            h3{
                padding:5px 0;
            }
            
            dl{
                position:relative;
                overflow:hidden;
                .dl{
                    position:absolute;
                    left:0px;top:0px;
                    height:344px;width:288px;
                    background:#C12324;
                    opacity:0.5;
                }
                margin:5px 0;
                float:left;
                margin-right:11px;
                background:#f2f2f2;
                height:345px;
                width:289px;
                dt{
                    margin:17px;
                    padding:20px;
                    background:white;
                }
                dd{
                    padding:0 10px;
                    p{
                        font-size:14px;
                    }
                    .money{
                        float:left;
                    }
                    .kan{
                        float:right;
                        color:red;
                        text-decoration:none;
                    }
                    span{
                        color:red;
                        a{
                            text-decoration:line-through;
                            color:#CDCDCD;
                        }
                    }
                }
            }
            .last{
                margin-right:0;   
            }
            .end{
                dt{
                    padding-bottom:35px;
                }
            }
        }
    }    
}
#fot{
    width:100%;
    height:100%;
    .center{
        width:1200px;
        margin:0 auto;
        h3{
            padding:10px 0;
            font-size:30px;
            span{
                color:#969896;
            }
        }
        ul{
            display:flex;
            li{
                flex:1;
                &:hover{
                    span{
                        transform:scale(1.3);
                    }   
                }
                span{
                    display:flex;
                    justify-content:center;
                }
                list-style:none;
                border:1px solid red;
                .span1{
                    padding:39px 0;
                }
                .span2{
                    padding:26px 0;
                }
                .span3{
                    padding:29px 0;
                }
                .span4{
                    padding:9px 0;
                }
                .span5{
                    padding:29px 0;
                }
                .span6{
                    padding:30px 0;
                }
                .span7{
                    padding:33px 0;
                }
            }
        }
    }
}
